import React, { Component } from 'react';
import {
  Button,
  Modal,
  Select,
  Form,
  Row,
  Col,
  Input,
  Radio,
  Table,
  DatePicker,
  notification,
  Divider,
  Tabs,
  InputNumber,
  Card,
} from 'antd';
import BaseComponent from '@/components/BaseComponent';
import { connect } from 'dva';
import request from 'umi-request';
import style from '../index.css';
import moment from 'moment';
import {
  maritalStatusData,
  degreeEducationData,
  headwatersData,
  drinkData,
  systolicPressureData,
  diastolicPressureData,
  drinkQuantityData,
  drinkFrequencyData,
  blackTeaYearData,
  greenTeaYearData,
  foodData,
  whether,
  loseToothData,
  plantToothData,
  verifyTimeData,
  helicobacterPyloriDetectionMethodData,
  mealTimeData,
  populationData,
  incomeData,
} from '../OptionData';
import { array } from 'prop-types';

const { TabPane } = Tabs;
const tumorNameList = [
  { label: '肺癌', value: '1' },
  { label: '乳腺癌', value: '2' },
  { label: '结直肠癌', value: '3' },
  { label: '肝癌', value: '4' },
  { label: '胃癌', value: '5' },
  { label: '食管癌', value: '6' },
  { label: '子宫颈癌', value: '7' },
  { label: '甲状腺癌', value: '8' },
  { label: '前列腺癌', value: '9' },
  { label: '子宫体癌', value: '10' },
  { label: '口腔和咽喉肿瘤', value: '11' },
  { label: '鼻咽癌', value: '12' },
  { label: '肛门癌', value: '13' },
  { label: '胆囊癌', value: '14' },
  { label: '胰腺癌', value: '15' },
  { label: '喉癌', value: '16' },
  { label: '骨肿瘤', value: '17' },
  { label: '皮肤黑色素瘤', value: '18' },
  { label: '卵巢癌', value: '19' },
  { label: '睾丸癌', value: '20' },
  { label: '肾癌', value: '21' },
  { label: '膀胱癌', value: '22' },
  { label: '脑和中枢神经系统肿瘤', value: '23' },
  { label: '淋巴瘤', value: '24' },
  { label: '白血病', value: '25' },
  { label: '其他', value: '26' },
];
const hasDefaultValueFields = [
  [
    'smoke',
    'drink',
    'blackTea',
    'greenTea',
    'vegetable',
    'fruits',
    'eggsMilk',
    'BeanFood',
    'sunDryFood',
    'deepFryFood',
    'hotFood',
    'mildewFood',
    'mealTime',
    'tooth',
    'else',
    'gastroscope',
    'oesophagitis',
    'cardiaIntestinalMetaplasia',
    'nonAtrophicGastritis',
    'atrophicGastritis',
    'intestinalMetaplasia',
    'gastricAndDuodenalUlcers',
    'gastricPolyps',
    'lowGradeIntraepithelialNeoplasia',
    'highGradeNeoplasiaAndEarlyCancer',
    'barrettEsophagus',
    'historyOfBenignDiseaseSubtotalGastrectomy',
    'historyOfSubtotalGastrectomyForGastricCancer',
    'gastricMucosaGiantFoldSign',
    'helicobacterPyloriInfection',
    'hepatitis',
    'squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTract',
    'perniciousAnemia',
    'firstDegreeRelativeHadTumor',
  ],

  [
    'isCheck',
    'isColorectalPolyps',
    'isIBD',
    'isColorectalPatients',
    'hasOtherMalignancy',
    'relativesHasColorectalPatients',
    'hasCC',
    'hasCDD',
    'mucousBloodyStool',
    'hasChronicAppendicitis',
    'hasChronicCholecystitis',
    'hasDivineDamage',
  ],
];
@connect(({ user }) => ({
  // data: risk.riskData,
  currentUser: user.currentUser,
}))
export default class index extends BaseComponent {
  constructor(props) {
    super(props);

    this.state = {
      visible: false,
      form: {},
      isopen: false,
      hasIBDYear: '',
      hasIBDMouth: '',
      content: {
        user: '',
        id: '',
        orgId: '',
        content: [],
        provinceName: '',
        cityName: '',
        districtName: '',
        address: '',
        userName: '',
        phone: '',
        idCard: '',
        firstDegreeRelativeHadTumor: '',
        sex: '',
        maritalStatus: '',
        degreeEducation: '',
        population: '',
        income: '',
        height: '',
        weight: '',
        systolicPressure: '',
        diastolicPressure: '',
        headwaters: '',
        smoke: '',
        smokingFrequency: '',
        smokingYear: '',
        drink: '',
        drinkQuantity: '',
        drinkFrequency: '',
        blackTeaYear: '',
        greenTeaYear: '',
        loseTooth: '',
        plantTooth: '',
        oesophagitisTime: '',
        cardiaIntestinalMetaplasiaTime: '',
        nonAtrophicGastritisTime: '',
        gastricAndDuodenalUlcersTime: '',
        intestinalMetaplasiaTime: '',
        gastricPolypsTime: '',
        lowGradeIntraepithelialNeoplasiaTime: '',
        highGradeNeoplasiaAndEarlyCancerTime: '',
        barrettEsophagusTime: '',
        historyOfBenignDiseaseSubtotalGastrectomyTime: '',
        historyOfSubtotalGastrectomyForGastricCancerTime: '',
        squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTractTime: '',
        gastricMucosaGiantFoldSignTime: '',
        helicobacterPyloriInfectionTime: '',
        hepatitisTime: '',
        perniciousAnemiaTime: '',
        blackTea: '',
        greenTea: '',
        vegetable: '',
        eggsMilk: '',
        sunDryFood: '',
        hotFood: '',
        fruits: '',
        BeanFood: '',
        deepFryFood: '',
        mildewFood: '',
        mealTime: '',
        tooth: '',
        gastroscope: '',
        historyOfBenignDiseaseSubtotalGastrectomy: '',
        gastricMucosaGiantFoldSign: '',
        helicobacterPyloriInfection: '',
        hepatitis: '',
        squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTract: '',
        perniciousAnemia: '',
        historyOfSubtotalGastrectomyForGastricCancer: '',
        helicobacterPyloriDetectionMethod: '',
        else: '',

        oesophagitis: '',
        cardiaIntestinalMetaplasia: '',
        nonAtrophicGastritis: '',
        atrophicGastritis: '',
        intestinalMetaplasia: '',
        gastricAndDuodenalUlcers: '',
        gastricPolyps: '',
        highGradeNeoplasiaAndEarlyCancer: '',
        lowGradeIntraepithelialNeoplasia: '',
        barrettEsophagus: '',
        atrophicGastritisTime: '',
        diseasName: '',
        elseTime: '',
      }, // 用来存储数据结构保证提交时不会出现 null值
      colorectalCancerContent: {
        // ..
        isCheck: '',
        lastCheckYear: '',
        isColorectalPolyps: '',
        isIBD: '',
        hasIBDTime: '',
        isColorectalPatients: '',
        hasOtherMalignancy: '',
        relativesHasColorectalPatients: '',
        relativesHasColorectalPatientsNum: '',
        relativesHasColorectalPatientsMinAge: '',
        hasCC: '',
        hasCDD: '',
        mucousBloodyStool: '',
        hasChronicAppendicitis: '',
        hasChronicCholecystitis: '',
        hasDivineDamage: '',
      }, // 用来存储数据结构保证提交时不会出现 null值
      familialHistory: [{}, {}, {}],
    };
  }

  render() {
    const { visible } = this.state;
    console.log(this.props.form);

    const columns = [
      {
        title: '亲属关系',
        dataIndex: 'domesticRelation',
        key: 'domesticRelation',
        render: (text, record, index) => (
          <div>
            <Radio.Group
              onChange={this.domesticRelationChange(index)}
              value={record.domesticRelation}
            >
              <Radio value="1">父母</Radio>
              <Radio value="2">兄弟姐妹</Radio>
              <Radio value="3">儿女</Radio>
            </Radio.Group>
          </div>
        ),
      },
      {
        title: '肿瘤名称',
        dataIndex: 'tumorName',
        key: 'tumorName',
        render: (text, record, index) => {
          const { tumorName } = record;
          const str = tumorName ? tumorNameList.find(item => item.value == tumorName) : '';
          // return str.label;
          return (
            <Select defaultValue={tumorName} onChange={this.tumorNameChange(index)}>
              {tumorNameList.map(item => (
                <Select.Option key={item.value}>{item.label}</Select.Option>
              ))}
            </Select>
          );
        },
      },
      {
        title: '操作',
        key: 'action',
        render: (text, record, index) => (
          <div>
            <Button
              style={{ marginLeft: '10px' }}
              type="danger"
              onClick={this.delDomesticRelation(index)}
            >
              删除
            </Button>
          </div>
        ),
      },
    ];

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 8 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
    };
    const { record } = this.props;
    const color = record.risk_report_id ? '#67c23a' : '#e6a23c';

    return (
      <div>
        <Button
          type="primary"
          style={{ marginLeft: '10px', background: color, borderColor: color }}
          onClick={this.showModal}
        >
          自测表
        </Button>
        <Modal
          title="自测表查看"
          visible={visible}
          onOk={this.handleOk}
          onCancel={this.handleCancel}
          width={1500}
        >
          <Form {...formItemLayout}>
            <h3>基本信息</h3>
            <Divider />
            <Row>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    省份
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input placeholder="省份" value={this.state.form.provinceName} disabled />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    城市
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input placeholder="城市" value={this.state.form.cityName} disabled />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    区县
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input placeholder="区县" value={this.state.form.districtName} disabled />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    详细地址
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input placeholder="详细地址" value={this.state.form.address} />
                  </Col>
                </Row>
              </Col>
            </Row>

            <Row>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    姓名
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input placeholder="姓名" value={this.state.form.userName} disabled />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    性别
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Radio.Group value={this.state.form.sex} disabled>
                      <Radio value="1">男</Radio>
                      <Radio value="2">女</Radio>
                    </Radio.Group>
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    身份证
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input
                      placeholder="身份证"
                      disabled
                      value={this.state.form.idCard}
                      style={{ width: '200px' }}
                    />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    电话
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input
                      placeholder="电话"
                      value={this.state.form.phone}
                      style={{ width: '200px' }}
                    />
                  </Col>
                </Row>
              </Col>
            </Row>

            <Row>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    婚姻状况
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.maritalStatus}
                      onChange={e => this.inputChangeHandle('maritalStatus', e)}
                    >
                      {maritalStatusData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    教育程度
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.degreeEducation}
                      onChange={e => this.inputChangeHandle('degreeEducation', e)}
                    >
                      {degreeEducationData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    您家现在有几口人?（同户籍）
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.population}
                      onChange={e => this.inputChangeHandle('population', e)}
                    >
                      {populationData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    您家庭平均年收入大约多少元
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.income}
                      onChange={e => this.inputChangeHandle('income', e)}
                    >
                      {incomeData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
            </Row>

            <Row>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    身高(cm)
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input
                      placeholder="身高"
                      value={this.state.form.height}
                      onChange={e => this.inputChangeHandle('height', e)}
                    />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    体重(Kg)
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Input
                      placeholder="体重"
                      value={this.state.form.weight}
                      onChange={e => this.inputChangeHandle('weight', e)}
                    />
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    收缩压
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.systolicPressure}
                      onChange={e => this.inputChangeHandle('systolicPressure', e)}
                    >
                      {systolicPressureData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
              <Col span={6}>
                <Row style={{ display: 'flex' }}>
                  <Col span={8} className={style.formLabel}>
                    舒张压
                  </Col>
                  <Col span={16} className={style.formText}>
                    <Select
                      allowClear
                      value={this.state.form.diastolicPressure}
                      onChange={e => this.inputChangeHandle('diastolicPressure', e)}
                    >
                      {diastolicPressureData.map(item => (
                        <Select.Option key={item.value}>{item.label}</Select.Option>
                      ))}
                    </Select>
                  </Col>
                </Row>
              </Col>
            </Row>
            <Divider />

            <Tabs defaultActiveKey="1">
              <TabPane tab="上消化道肿瘤风险因素自测表" key="1">
                <h3 style={{ marginTop: '30px' }}>生活方式</h3>
                <Divider />

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        饮水主要来源
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Select
                          allowClear
                          value={this.state.form.headwaters}
                          onChange={e => this.inputChangeHandle('headwaters', e)}
                        >
                          {headwatersData.map(item => (
                            <Select.Option key={item.value}>{item.label}</Select.Option>
                          ))}
                        </Select>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        吸烟
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          onChange={e => this.inputChangeHandle('smoke', e)}
                          value={this.state.form.smoke}
                        >
                          <Radio value="1">否</Radio>
                          <Radio value="2">是</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.smoke === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            吸烟频率(支/天)
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Input
                              placeholder="吸烟频率(支/天)"
                              onChange={e => this.inputChangeHandle('smokingFrequency', e)}
                              value={this.state.form.smokingFrequency}
                            />
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            吸烟持续年数(年)
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Input
                              placeholder="吸烟持续年数(年)"
                              // onChange={this.smokingYearChange} ///
                              onChange={e => this.inputChangeHandle('smokingYear', e)}
                              value={this.state.form.smokingYear}
                            />
                          </Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        饮酒
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Select
                          allowClear
                          value={this.state.form.drink}
                          onChange={e => this.inputChangeHandle('drink', e)}
                        >
                          {drinkData.map(item => (
                            <Select.Option key={item.value}>{item.label}</Select.Option>
                          ))}
                        </Select>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.drink === '3' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            饮酒量
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.drinkQuantity}
                              onChange={e => this.inputChangeHandle('drinkQuantity', e)}
                            >
                              {drinkQuantityData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            饮酒频率(年)
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.drinkFrequency}
                              onChange={e => this.inputChangeHandle('drinkFrequency', e)}
                            >
                              {drinkFrequencyData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        饮红茶
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          onChange={e => this.inputChangeHandle('blackTea', e)}
                          value={this.state.form.blackTea}
                        >
                          <Radio value="1">不喝</Radio>
                          <Radio value="2">偶尔喝</Radio>
                          <Radio value="3">经常喝</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.blackTea == '3' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            饮茶持续年数
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.blackTeaYear}
                              onChange={e => this.inputChangeHandle('blackTeaYear', e)}
                            >
                              {blackTeaYearData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        饮绿茶
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          onChange={e => this.inputChangeHandle('greenTea', e)}
                          value={this.state.form.greenTea}
                        >
                          <Radio value="1">不喝</Radio>
                          <Radio value="2">偶尔喝</Radio>
                          <Radio value="3">经常喝</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.greenTea == '3' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            饮茶持续年数
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.greenTeaYear}
                              onChange={e => this.inputChangeHandle('greenTeaYear', e)}
                            >
                              {greenTeaYearData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <h3 style={{ marginTop: '30px' }}>下列食物您经常吃吗</h3>
                <Divider></Divider>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        新鲜蔬菜
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('vegetable', e)}
                          value={this.state.form.vegetable}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        新鲜水果
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('fruits', e)}
                          value={this.state.form.fruits}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        肉蛋奶类
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('eggsMilk', e)}
                          value={this.state.form.eggsMilk}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        豆类食品
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('BeanFood', e)}
                          value={this.state.form.BeanFood}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        腌晒食品
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('sunDryFood', e)}
                          value={this.state.form.sunDryFood}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        油炸食品
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('deepFryFood', e)}
                          value={this.state.form.deepFryFood}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        热烫食品
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('hotFood', e)}
                          value={this.state.form.hotFood}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        霉变食品
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={foodData}
                          onChange={e => this.inputChangeHandle('mildewFood', e)}
                          value={this.state.form.mildewFood}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        平时吃一顿饭多少分钟？
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={mealTimeData}
                          onChange={e => this.inputChangeHandle('mealTime', e)}
                          value={this.state.form.mealTime}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        有没有牙齿缺失
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('tooth', e)}
                          value={this.state.form.tooth}
                        />
                      </Col>
                    </Row>
                  </Col>

                  {this.state.form.tooth === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            缺失几颗牙
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.loseTooth}
                              onChange={e => this.inputChangeHandle('loseTooth', e)}
                            >
                              {loseToothData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            种植/镶几颗牙
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.plantTooth}
                              onChange={e => this.inputChangeHandle('plantTooth', e)}
                            >
                              {plantToothData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <h3 style={{ marginTop: '30px' }}>消化系统疾病史</h3>
                <Divider></Divider>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        是否做过胃镜
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('gastroscope', e)}
                          value={this.state.form.gastroscope}
                        />
                      </Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>

                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        反流性食管炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('oesophagitis', e)}
                          value={this.state.form.oesophagitis}
                        />
                      </Col>
                    </Row>
                  </Col>

                  {this.state.form.oesophagitis === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.oesophagitisTime}
                              onChange={e => this.inputChangeHandle('oesophagitisTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        贲门肠上皮化生
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('cardiaIntestinalMetaplasia', e)}
                          value={this.state.form.cardiaIntestinalMetaplasia}
                        />
                      </Col>
                    </Row>
                  </Col>

                  {this.state.form.cardiaIntestinalMetaplasia === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.cardiaIntestinalMetaplasiaTime}
                              onChange={e =>
                                this.inputChangeHandle('cardiaIntestinalMetaplasiaTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        非萎缩性胃炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('nonAtrophicGastritis', e)}
                          value={this.state.form.nonAtrophicGastritis}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.nonAtrophicGastritis === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.nonAtrophicGastritisTime}
                              onChange={e => this.inputChangeHandle('nonAtrophicGastritisTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        萎缩性胃炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('atrophicGastritis', e)}
                          value={this.state.form.atrophicGastritis}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.atrophicGastritis === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.atrophicGastritisTime}
                              onChange={e => this.inputChangeHandle('atrophicGastritisTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        肠上皮化生
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('intestinalMetaplasia', e)}
                          value={this.state.form.intestinalMetaplasia}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.intestinalMetaplasia === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.intestinalMetaplasiaTime}
                              onChange={e => this.inputChangeHandle('intestinalMetaplasiaTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        胃、十二指肠溃疡
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('gastricAndDuodenalUlcers', e)}
                          value={this.state.form.gastricAndDuodenalUlcers}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.gastricAndDuodenalUlcers === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.gastricAndDuodenalUlcersTime}
                              onChange={e =>
                                this.inputChangeHandle('gastricAndDuodenalUlcersTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        胃息肉
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('gastricPolyps', e)}
                          value={this.state.form.gastricPolyps}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.gastricPolyps === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.gastricPolypsTime}
                              onChange={e => this.inputChangeHandle('gastricPolypsTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        低级别上皮内瘤变
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e =>
                            this.inputChangeHandle('lowGradeIntraepithelialNeoplasia', e)
                          }
                          value={this.state.form.lowGradeIntraepithelialNeoplasia}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.lowGradeIntraepithelialNeoplasia === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.lowGradeIntraepithelialNeoplasiaTime}
                              onChange={e =>
                                this.inputChangeHandle('lowGradeIntraepithelialNeoplasiaTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        高级别瘤变与早癌
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e =>
                            this.inputChangeHandle('highGradeNeoplasiaAndEarlyCancer', e)
                          }
                          value={this.state.form.highGradeNeoplasiaAndEarlyCancer}
                        />
                      </Col>
                    </Row>
                  </Col>

                  {this.state.form.highGradeNeoplasiaAndEarlyCancer === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.highGradeNeoplasiaAndEarlyCancerTime}
                              onChange={e =>
                                this.inputChangeHandle('highGradeNeoplasiaAndEarlyCancerTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        Barrett食管（巴雷特食管）
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('barrettEsophagus', e)}
                          value={this.state.form.barrettEsophagus}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.barrettEsophagus === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.barrettEsophagusTime}
                              onChange={e => this.inputChangeHandle('barrettEsophagusTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        良性疾病胃大部切除史
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e =>
                            this.inputChangeHandle('historyOfBenignDiseaseSubtotalGastrectomy', e)
                          }
                          value={this.state.form.historyOfBenignDiseaseSubtotalGastrectomy}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.historyOfBenignDiseaseSubtotalGastrectomy === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.historyOfBenignDiseaseSubtotalGastrectomyTime}
                              onChange={e =>
                                this.inputChangeHandle(
                                  'historyOfBenignDiseaseSubtotalGastrectomyTime',
                                  e
                                )
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>

                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        胃癌胃大部切除史
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e =>
                            this.inputChangeHandle(
                              'historyOfSubtotalGastrectomyForGastricCancer',
                              e
                            )
                          }
                          value={this.state.form.historyOfSubtotalGastrectomyForGastricCancer}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.historyOfSubtotalGastrectomyForGastricCancer === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={
                                this.state.form.historyOfSubtotalGastrectomyForGastricCancerTime
                              }
                              onChange={e =>
                                this.inputChangeHandle(
                                  'historyOfSubtotalGastrectomyForGastricCancerTime',
                                  e
                                )
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        胃黏膜巨大皱褶征
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('gastricMucosaGiantFoldSign', e)}
                          value={this.state.form.gastricMucosaGiantFoldSign}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.gastricMucosaGiantFoldSign === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.gastricMucosaGiantFoldSignTime}
                              onChange={e =>
                                this.inputChangeHandle('gastricMucosaGiantFoldSignTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        幽门螺杆菌感染
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('helicobacterPyloriInfection', e)}
                          value={this.state.form.helicobacterPyloriInfection}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.helicobacterPyloriInfection === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.helicobacterPyloriInfectionTime}
                              onChange={e =>
                                this.inputChangeHandle('helicobacterPyloriInfectionTime', e)
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            幽门螺杆菌检测方法
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.helicobacterPyloriDetectionMethod}
                              onChange={e =>
                                this.inputChangeHandle('helicobacterPyloriDetectionMethod', e)
                              }
                            >
                              {helicobacterPyloriDetectionMethodData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        肝炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('hepatitis', e)}
                          value={this.state.form.hepatitis}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.hepatitis === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.hepatitisTime}
                              onChange={e => this.inputChangeHandle('hepatitisTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        头颈部或呼吸道鳞癌
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e =>
                            this.inputChangeHandle(
                              'squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTract',
                              e
                            )
                          }
                          value={
                            this.state.form.squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTract
                          }
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTract === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={
                                this.state.form
                                  .squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTractTime
                              }
                              onChange={e =>
                                this.inputChangeHandle(
                                  'squamousCellCarcinomaOfTheHeadNeckOrRespiratoryTractTime',
                                  e
                                )
                              }
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        恶性贫血
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('perniciousAnemia', e)}
                          value={this.state.form.perniciousAnemia}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.perniciousAnemia === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.perniciousAnemiaTime}
                              onChange={e => this.inputChangeHandle('perniciousAnemiaTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <Row>
                  <Col span={8}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        其它
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={e => this.inputChangeHandle('else', e)}
                          value={this.state.form.else}
                        />
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.else === '2' ? (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病名称
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Input
                              placeholder="疾病名称"
                              value={this.state.form.diseasName}
                              onChange={e => this.inputChangeHandle('diseasName', e)}
                            />
                          </Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            疾病确诊后时间
                          </Col>
                          <Col span={18} className={style.formText}>
                            <Select
                              allowClear
                              value={this.state.form.elseTime}
                              onChange={e => this.inputChangeHandle('elseTime', e)}
                            >
                              {verifyTimeData.map(item => (
                                <Select.Option key={item.value}>{item.label}</Select.Option>
                              ))}
                            </Select>
                          </Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                      <Col span={8}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>

                <h3 style={{ marginTop: '30px' }}>肿瘤家族史</h3>
                <Divider />
                <Row>
                  <Col span={24}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={2} className={style.formLabel}>
                        你家中有没有人得过肿瘤
                      </Col>
                      <Col span={22} className={style.formText}>
                        <Radio.Group
                          options={whether}
                          onChange={this.firstDegreeRelativeHadTumorChange}
                          value={this.state.form.firstDegreeRelativeHadTumor}
                        />
                      </Col>
                    </Row>
                  </Col>
                </Row>
                {this.state.form.firstDegreeRelativeHadTumor === '2' && (
                  <>
                    <Card>
                      <Button type="primary" onClick={this.addDomesticRelation}>
                        添加
                      </Button>
                      <Table
                        columns={columns}
                        dataSource={this.state.familialHistory}
                        rowKey="id"
                      />
                    </Card>
                  </>
                )}
              </TabPane>
              <TabPane tab="结直肠癌风险因素自测表" key="2">
                <h3 style={{ marginTop: '30px' }}>结直肠疾病史</h3>
                <Divider />
                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        是否曾接受过结肠镜检查
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.isCheck}
                          onChange={e => this.inputChangeHandle('isCheck', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.isCheck == 1 ? (
                    <Col span={12}>
                      <Row style={{ display: 'flex' }}>
                        <Col span={6} className={style.formLabel}>
                          最后一次结肠镜检查的年份
                        </Col>
                        <Col span={18} className={style.formText}>
                          <DatePicker
                            mode="year"
                            onPanelChange={(value, mode, filed) => {
                              this.handleDatePickerChange(value, mode, 'lastCheckYear');
                            }}
                            value={this.state.form.lastCheckYear}
                            format="YYYY"
                          />
                        </Col>
                      </Row>
                    </Col>
                  ) : (
                    <Col span={12}>
                      <Row style={{ display: 'flex' }}>
                        <Col span={6} className={style.formLabel}></Col>
                        <Col span={18} className={style.formText}></Col>
                      </Row>
                    </Col>
                  )}
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否曾诊断结直肠息肉
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          onChange={e => this.inputChangeHandle('isColorectalPolyps', e)}
                          value={this.state.form.isColorectalPolyps}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否曾诊断炎性肠病
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.isIBD}
                          onChange={e => this.inputChangeHandle('isIBD', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.isIBD == 1 ? (
                    <Col span={12}>
                      <Row style={{ display: 'flex' }}>
                        <Col span={6} className={style.formLabel}>
                          诊断IBD距今时间
                        </Col>
                        <Col span={18} className={style.formText}>
                          <InputNumber
                            v-model="hasIBDYear"
                            onChange={e => {
                              this.inputNumberChangeHandle(e, 'hasIBDYear');
                            }}
                            min={0}
                          ></InputNumber>
                          <span style={{ margin: '0px 5px' }}>年</span>
                          <InputNumber
                            min={0}
                            v-model="hasIBDMouth"
                            onChange={e => {
                              this.inputNumberChangeHandle(e, 'hasIBDMouth');
                            }}
                          ></InputNumber>
                          <span style={{ margin: '0px 5px' }}>月</span>
                        </Col>
                      </Row>
                    </Col>
                  ) : (
                    <Col span={12}>
                      <Row style={{ display: 'flex' }}>
                        <Col span={6} className={style.formLabel}></Col>
                        <Col span={18} className={style.formText}></Col>
                      </Row>
                    </Col>
                  )}
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您本人是否为结直肠患者
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.isColorectalPatients}
                          onChange={e => this.inputChangeHandle('isColorectalPatients', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您本人是否诊断有其他恶性肿瘤
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasOtherMalignancy}
                          onChange={e => this.inputChangeHandle('hasOtherMalignancy', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>

                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <h3 style={{ marginTop: '30px' }}>结直肠家族史</h3>
                <Divider />
                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您的一级亲属中，是否有人患结直肠癌
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.relativesHasColorectalPatients}
                          onChange={e =>
                            this.inputChangeHandle('relativesHasColorectalPatients', e)
                          }
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  {this.state.form.relativesHasColorectalPatients == 1 ? (
                    <>
                      <Col span={12}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            一级亲属中诊断肠癌的共有几人
                          </Col>
                          <Col span={18} className={style.formText}>
                            <InputNumber
                              min={0}
                              value={this.state.form.relativesHasColorectalPatientsNum}
                              onChange={e => {
                                this.inputNumberChangeHandle(
                                  e,
                                  'relativesHasColorectalPatientsNum'
                                );
                              }}
                            />
                          </Col>
                        </Row>
                      </Col>

                      <Col span={12}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}>
                            诊断肠癌的一级亲属中，诊断时最小的是几岁
                          </Col>
                          <Col span={18} className={style.formText}>
                            <InputNumber
                              min={0}
                              value={this.state.form.relativesHasColorectalPatientsMinAge}
                              onChange={e => {
                                this.inputNumberChangeHandle(
                                  e,
                                  'relativesHasColorectalPatientsMinAge'
                                );
                              }}
                            />
                          </Col>
                        </Row>
                      </Col>
                      <Col span={12}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  ) : (
                    <>
                      <Col span={12}>
                        <Row style={{ display: 'flex' }}>
                          <Col span={6} className={style.formLabel}></Col>
                          <Col span={18} className={style.formText}></Col>
                        </Row>
                      </Col>
                    </>
                  )}
                </Row>
                <h3 style={{ marginTop: '30px' }}>其他风险因素</h3>
                <Divider />
                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有慢性便秘
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasCC}
                          onChange={e => this.inputChangeHandle('hasCC', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>

                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有慢性腹泻
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasCDD}
                          onChange={e => this.inputChangeHandle('hasCDD', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>

                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有粘液血便
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.mucousBloodyStool}
                          onChange={e => this.inputChangeHandle('mucousBloodyStool', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有慢性阑尾炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasChronicAppendicitis}
                          onChange={e => this.inputChangeHandle('hasChronicAppendicitis', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有慢性胆囊炎
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasChronicCholecystitis}
                          onChange={e => this.inputChangeHandle('hasChronicCholecystitis', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}>
                        您是否有长期遭受精神伤害
                      </Col>
                      <Col span={18} className={style.formText}>
                        <Radio.Group
                          value={this.state.form.hasDivineDamage}
                          onChange={e => this.inputChangeHandle('hasDivineDamage', e)}
                        >
                          <Radio value="1">是</Radio>
                          <Radio value="2">否</Radio>
                          <Radio value="3">不清楚</Radio>
                        </Radio.Group>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Row style={{ display: 'flex' }}>
                      <Col span={6} className={style.formLabel}></Col>
                      <Col span={18} className={style.formText}></Col>
                    </Row>
                  </Col>
                </Row>
              </TabPane>
            </Tabs>
          </Form>
        </Modal>
      </div>
    );
  }

  showModal = () => {
    /**详情*/
    this.execHttp('crowdDataReport/findById', {
      id: this.props.record.id,
    }).then(resp => {
      if (resp && resp.success) {
        if (resp.data.response.riskReportId) {
          this.setState({
            visible: true,
          });
          //
          this.getDataByPage(resp.data.response.riskReportId);
        } else {
          // hasDefaultValueFields
          const form = {
            provinceName: this.props.record.province_name,
            cityName: this.props.record.city_name,
            districtName: this.props.record.district_name,
            address: this.props.record.addr,
            userName: this.props.record.name,
            phone: this.props.record.phone,
            idCard: this.props.record.sfz,
            sex: this.props.record.sex == '男' ? '1' : '2',
          };
          hasDefaultValueFields.forEach((array, aIndex) => {
            for (let index = 0; index < array.length; index++) {
              const element = array[index];
              form[element] = aIndex == 0 ? '1' : '2';
            }
          });
          this.setState(
            {
              visible: true,
              form,
            },
            () => {}
          );
        }
      }
    });
  };

  getDataByPage = id => {
    this.execHttp('qrCode/viewDetails', {
      id,
    }).then(resp => {
      if (resp.success) {
        const content = JSON.parse(resp.data.content);
        const colorectalCancerContent = JSON.parse(resp.data.colorectalCancerContent);
        const data = {
          ...content,
          ...colorectalCancerContent,
        };

        const lastCheckYear = data.lastCheckYear;

        if (data.hasIBDTime) {
          let temArr1 = data.hasIBDTime.split('月');
          let temArr2 = temArr1[0].split('年');
          const hasIBDYear = temArr2[0];
          const hasIBDMonth = temArr2[1];

          this.setState({
            hasIBDYear,
            hasIBDMonth,
          });
        }
        if (data.lastCheckYear) {
          data.lastCheckYear = moment(data.lastCheckYear);
        }
        // content
        // colorectalCancerContent
        const { familialHistory } = this.state;
        this.setState({
          form: data,

          familialHistory: data ? data.content : familialHistory,
        });
      }
    });
  };

  handleCancel = () => {
    this.setState({
      visible: false,
    });
  };
  inputChangeHandle = (filed, event) => {
    const form = { ...this.state.form };
    form[filed] = event.target ? event.target.value : event;

    console.log(form[filed]);

    this.setState({
      form,
    });
  };

  heightChange = e => {
    const value = e.target.value;
    this.setState(params => ({
      form: {
        ...params.form,
        height: value,
      },
    }));
  };

  firstDegreeRelativeHadTumorChange = e => {
    const value = e.target.value;
    this.setState(params => ({
      form: {
        ...params.form,
        firstDegreeRelativeHadTumor: value,
      },
    }));
  };

  delDomesticRelation = index => {
    return () => {
      const { familialHistory } = this.state;
      familialHistory.splice(index, 1);
      this.setState({
        familialHistory,
      });
    };
  };
  // 添加亲属关系
  addDomesticRelation = () => {
    const { familialHistory } = this.state;

    familialHistory.push([]);

    this.setState({
      familialHistory,
    });
  };

  domesticRelationChange = index => {
    return e => {
      const { familialHistory } = this.state;
      const value = e.target.value;
      familialHistory[index].domesticRelation = value;
      this.setState({
        familialHistory,
      });
    };
  };

  tumorNameChange = index => {
    return e => {
      const { familialHistory } = this.state;
      familialHistory[index].tumorName = e;
      this.setState({
        familialHistory,
      });
    };
  };

  inputNumberChangeHandle = (e, filed) => {
    //     hasIBDYear
    // hasIBDMouth
    const { form } = this.state;
    let hasIBDYear = this.state.form.hasIBDYear;
    let hasIBDMouth = this.state.form.hasIBDMouth;
    if (filed == 'hasIBDYear' || filed == 'hasIBDMouth') {
      if (filed == 'hasIBDYear') {
        hasIBDYear = e;
      } else if (filed == 'hasIBDMouth') {
        hasIBDMouth = e;
      }
      form.hasIBDTime = hasIBDYear + '年' + hasIBDMouth + '月';
      this.setState({
        hasIBDYear,
        hasIBDMouth,
        form,
      });
    } else {
      form[filed] = e;
      this.setState({
        form,
      });
    }
  };

  handleOk = () => {
    this.setState({
      visible: true,
    });
    //
    // const content = {
    //   user: this.props.currentUser.id,
    //   id: this.props.record.id,
    //   orgId: this.props.record.org_id,
    //   content: this.state.familialHistory,
    //   ...this.state.form
    // }

    const { colorectalCancerContent, content, form } = this.state;
    for (const key in colorectalCancerContent) {
      colorectalCancerContent[key] = form[key];
    }

    for (const key in content) {
      content[key] = form[key];
    }

    content.user = this.props.currentUser.id;
    content.id = this.props.record.id;
    content.orgId = this.props.record.org_id;
    content.content = this.state.familialHistory;

    let data = {
      content: { ...content },
      colorectalCancerContent: { ...colorectalCancerContent },
    };

    request('/api/cdcerservice/v1/riskfactor/edit', {
      method: 'POST',
      requestType: 'form',
      data: {
        user: this.props.currentUser.id,
        id: this.props.record.id,
        orgId: this.props.record.org_id,
        userName: content.userName,
        idCard: content.idCard,
        content: JSON.stringify(data.content),
        colorectalCancerContent: JSON.stringify(data.colorectalCancerContent),
      },
    }).then(() => {
      notification.open({
        message: '上报成功',
      });
      this.setState({
        visible: false,
      });
      this.props.getDataByPage({});
    });
  };
  handleDatePickerChange = (value, mode, filed) => {
    const { form } = this.state;
    form[filed] = value;
    console.log(typeof form[filed], form[filed]);

    this.setState({
      form,
    });
  };
}
